<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="../js/flexible.debug.js"></script>
    <script src="../js/flexible_css.debug.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/sousuo1.css"/>
</head>
<body>
    
    <header class="header">
        <div class="search">
            <img src="../imgs/sousuo%20(2).png"/>
            <input list="list" id="input_one" type="search" placeholder="搜服务"/>
            
        </div>
        <p class="quxiao">取消</p>
    </header>
    
    <section class="sec">
        <ul id="list">
        </ul>
    </section>
    <footer class="fot">
        <div id="btn" class="qingchu">
            清除搜索记录
        </div>
    </footer>
    
    
    
    <script src="../js/jquery-2.2.4.min.js"></script>
    <script>
        $(function($){
        function set(val,name){
            localStorage.setItem(val,name);
        };
        function get(name){
            return localStorage.getItem(name);
        };
        var sss = get("infos")
		if(sss){
			var value = $("#input_one").val("");
			var str = ''
			sss =JSON.parse(get("infos")) ;
			$.each(sss,function(i,v){
				str += '<li>'+v.name+'</li>';
			})
			$('#list').empty();
			$('#list').append(str);
		}
			
    $("#input_one").keydown(function(e){
        
       var value = $("#input_one").val();
        if(e.keyCode==13){
            var obj ={
                "name":value
                
            };
            //alert(1)
             var value = $("#input_one").val("");
            
            	
            
             	
            var infos = get("infos");
            if(infos){
                infos = JSON.parse(infos);
                infos.push(obj);
                 set("infos",JSON.stringify(infos));
            }else{
                set("infos",JSON.stringify([obj]));
                
            }
            
            var infos = get("infos");
			if(infos){
				var value = $("#input_one").val("");
				var str = ''
				infos =JSON.parse(get("infos")) ;
				$.each(infos,function(i,v){
					if(v.name == ""){
					}else{
						str += '<li>'+v.name+'</li>';
					}
					
				})
				$('#list').empty();
				$('#list').append(str);
			}

        }
        
    })
    //入口函数
//  var infos =get("infos");
//       var str = ""; 
//   infos = JSON.parse(infos)        
//    if(infos){
//        $.each(infos,function(i,n){
//             concat =   n.name;
//             str+= "<li>" +concat+ "</li>";
//        })
//        
//       
//        $("#list").append(str)
//    }        
     
    $("#btn").click(function(){
        
        localStorage.clear();
        
        var _null = get("infos");
		if(!_null){
			$('#list').empty();
		}
    })
    
    
        })
        $('#list').on('click','li',function(){
        	$("#input_one").val($(this).text())
        })
        $(".quxiao").on("click", function(){
           javascript :history.back(-1);
        });
    </script>
</body>
</html>